<%@page pageEncoding="UTF-8" contentType="text/html;charset=utf-8" errorPage="/commons/error.jsp"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang='zh-CN' xml:lang='zh-CN' xmlns='http://www.w3.org/1999/xhtml'>
<head>
<title>商品详情</title>
<style type="text/css">
table{font-size: 12px;}
</style>
</head>
<body>
<p>商品：<a href = '${ctx}/admin/product/detail/${product.id }'>${product.name}</a></p>
<hr />

<div>
	<table class="table table-striped" > 
		<tr>
			<td colspan="4"  align="center" style="border-style:solid; border-color: aqua;border-width: thin;">基本信息</td>
		</tr>
		<tr>
			<td><label for="name">名称</label></td>
			<td>${product.name }</td>
			<td width="10%"><label for="category">种类</label></td>
			<td>${product.category }</td>
		</tr>
		<tr>
			<td><label for="brand">品牌</label></td>
			<td>${product.brand }</td>
			<td></td>
			<td></td>
		</tr>
		<tr>
			<td><label for="image">图片</label></td>
			<td>
				<div id="localImage"  style="width: 300px; height: 200px; margin-bottom: 10px">  
	 						<img id="preview" alt="预览图片" src="${product.image }" width="300px" height="200px"/>  
				</div> 
			</td>
			<td><label for="description">描述</label></td>
			<td>${product.description }</td>
		</tr>
		<tr>
			<td><label>首页推荐</label></td>
			<td><input type="checkbox" <c:if test="${product.recommended}">checked="checked"</c:if> disabled="disabled"/></td>
			<td><label>激活</label></td>
			<td><input type="checkbox" <c:if test="${product.active}">checked="checked"</c:if> disabled="disabled"/></td>
		</tr>
		<tr>
			<td colspan="4" align="center">
				<button onclick='location.href="${ctx}/admin/product/update/${product.id }"'>更新</button>
			</td>
		</tr>
	</table>
</div>

<div style="width: 100%;">
	<table class="table table-striped" align="center" style="border-style:solid; border-color: aqua;border-width: thin;">
		<thead>
			<tr>
				<td colspan="4" align="center" style="border-style:solid; border-color: aqua;border-width: thin;">品类与规格</td>
			</tr>
		</thead>
		<tbody>
			<c:forEach var="item" items="${list_catalog}">
				<tr>
					<td><a href = "${ctx}/admin/catalog/detail/${item.id}">${item.name}</a></td>
					<td><input type="checkbox" <c:if test="${item.active}">checked="checked"</c:if> disabled="disabled"/></td>
					<td><fmt:formatDate value="${item.create_time}" pattern="yyyy-MM-dd HH:mm:ss" /></td>
					<td><a href="${ctx }/admin/catalog/delete/${item.product_id}/${item.id}">删除</a></td>
				</tr>
			</c:forEach>
		</tbody>
		<tfoot>
			<tr>
				<td colspan="4" align="center" style="border-style:solid; border-color: aqua;border-width: thin;"><input type="button" value="新增品类" onclick='location.href="${ctx}/admin/catalog/add/${product.id }"'/></td>
			</tr>
		</tfoot>
	</table>
</div>

<script type="text/javascript" src="${ctx}/scripts/lottery.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$("#nav_product").addClass("active");
	})
	
	function getCatalog(id) {
		var url = "/admin/catalog/list/"+id;
		$.get(url,  function(result) {
			var list = result.body;
			var $content = $("#tbody-catalog");
			for ( var o in list) {
				var catalog = list[o];
				var html = '';
				html += '<tr>';
				html += '<td>'+catalog.name+'</td>';
				html += '<td>'+catalog.create_time+'</td>';
				if(catalog.active) {
					html += '<td><input type="checkbox" checked="checked"/></td>';
				} else {
					html += '<td><input type="checkbox" /></td>';
				}
				html += '</tr>';
				
				$content.append(html);
			} 
			alert("12");
		});
	}
	
</script>
</body>
</html>